<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>createElement</title>
</head>

<body>
    <div id="test">页面原始文字</div>
    <button type="button" id="btn">点击我更换内容</button>
    <script>
        const createElement = str => {
            const element = document.createElement('div');
            element.innerHTML = str;
            return element.firstElementChild;
        };
        const test = document.getElementById('test'), btn = document.getElementById('btn');
        btn.onclick = () => {
            const el = createElement(`<div class="container"><p>Hello!</p></div>`);
            test.innerHTML = '';
            test.appendChild(el);
        }
    </script>
</body>

</html>